<script>
const app = getApp();
export default {
  name: "poster",
  data() {
    return {
      BestImgUrl: app.globalData.imgurlBwc,
      BestImgUrlTD: app.globalData.imgurl,
      Shareposters: [],// banner滚动图片
      dijige: 0,
      current1: 0,
      defoImg: '',
      lbHeight: '500',
      // #ifdef H5
      effect3dPreviousMargin: '220',
      // #endif
      urerinfo: {},
      poster: [
        app.globalData.imgurlBwc + '/poster/poster1.png',
        app.globalData.imgurlBwc + '/poster/poster2.png',
        app.globalData.imgurlBwc + '/poster/poster1.png',
      ],
      icon: [
        {image: app.globalData.imgurlBwc + '/poster/weixin@3x.png', name: '分享好友', sub_name: '强力转化'},
        {image: app.globalData.imgurlBwc + '/poster/download@3x.png', name: '保存海报', sub_name: '一键下载海报'},
        {image: app.globalData.imgurlBwc + '/poster/code@3x.png', name: '邀请码', sub_name: '可分享至外部平台'},
      ],
    //   获取文案内容
      copyWritingText: '',
      SanMaCuoWuShow: false, //复制文案弹出层

    }
  },
  onLoad() {
    this.getShareposters()
    let that = this
    that.urerinfo = uni.getStorageSync('userinfo');
    this.onShareAppMessage()
    this.onShareTimeline()
  },
  methods: {
    onShareAppMessage() {
      let myid = uni.getStorageSync('userinfo').id
      return {
        title: '邀请好友0元探店，边吃边赚',
        path: '/pages/index/index?parent_id=' + myid,
        imageUrl: app.globalData.imgurlBwc + '/poster/poster1.png',
      };
    },
    onShareTimeline() {
      let myid = uni.getStorageSync('userinfo').id
      return {
        title: '邀请好友0元探店，边吃边赚',
        path: '/pages/index/index?parent_id=' + myid,
        imageUrl: app.globalData.imgurlBwc + '/poster/poster1.png',
        success: (res) => {
          //console.log("转发成功", res);
        },
        fail: (res) => {
          //console.log("转发失败", res);
        }
      }
    },
    wxminisavePic() {
      let that = this
      that.defoImg = that.Shareposters[that.dijige]
      //console.log(that.dijige,that.defoImg)
      that.saveimages([that.defoImg])
    },
    //先判断是否授权保存相册权限
    saveimages(imglist) {
      let that = this
      // 可以通过 wx.getSetting 先查询一下用户是否授权了 "scope.writePhotosAlbum" 这个 scope
      // #ifdef MP-WEIXIN
      wx.getSetting({
        success: function (res) {
          if (!res.authSetting['scope.writePhotosAlbum']) {
            wx.authorize({
              scope: 'scope.writePhotosAlbum',
              success() { //这里是用户同意授权后的回调
                that.baocunimg(imglist);
              },
              fail() { //这里是用户拒绝授权后的回调
                wx.openSetting({
                  success: function (res) {
                  },
                  fail: function (e) {
                  },
                })
              }
            })
          } else {
            that.baocunimg(imglist);
          }
        },
        fail: function (res) {
        },
      })
      // #endif
    },
    qiehuanle(e) {
      console.log("qiehuanleqiehuanleqiehuanle123123123", e.detail.current)
      let that = this
      that.dijige = e.detail.current //e.detail.current
      that.defoImg = that.Shareposters[e.detail.current]
    },

    getShareposters() {
      let that = this
      // 获取复制文案内容
      that.$api.GetCopyWriting({}).then(res => {
         console.log('复制文案===', res.data.result.content)
        that.copyWritingText = res.data.result.content
      }).catch(err => {})
      // let SharepostersUpdateTime = uni.getStorageSync('SharepostersUpdateTime');
      // let SharepostersCurrentDate = new Date().getTime();
      //
      // //判断24小时后从接口更新一下菜单数据
      // if (!SharepostersUpdateTime || SharepostersCurrentDate - SharepostersUpdateTime >= 168 * 60 * 60 * 1000) {
      //缓存最新的数据到本地
      that.$api.GetShareposters({
        city: uni.getStorageSync('CityName'),
        province: uni.getStorageSync('Province'),
        // #ifdef APP-PLUS
        client: 'app',
        //#endif
        // #ifdef MP-WEIXIN
        client: 'applet',
        //#endif
        // #ifdef H5
        client: 'h5',
        //#endif
        appid: uni.getStorageSync('miniProgramAppId')
      }).then(res => {
        console.log('团购菜单', res)
        // uni.setStorageSync('SharepostersList', res.data.result);
        // uni.setStorageSync('SharepostersUpdateTime', SharepostersCurrentDate);
        that.Shareposters = res.data.result
        that.defoImg = that.Shareposters[0]
        that.Shareposters.push(that.defoImg)
      }).catch(err => {
      })
      // } else {
      //   that.Shareposters = uni.getStorageSync('SharepostersList')
      //   that.defoImg = that.Shareposters[0]
      // }
    },
    baocunimg(imglist) {
      let that = this
      uni.showLoading({
        mask: true,
        title: '保存中...'
      })
      let info = {
        image_path: imglist
      }
      if (info.image_path) {
        console.log('1', info.image_path)
        info.image_path.forEach(item => {
          console.log('2', info.image_path)
          uni.downloadFile({
            url: item,
            header: {
              "Content-Type": "image/jpeg"
            },
            success: res => {
              console.log('3', item)
              console.log('4', res)
              if (res.statusCode === 200) {
                uni.saveImageToPhotosAlbum({
                  filePath: res.tempFilePath,
                  success: function (res) {
                    uni.hideLoading()
                    uni.showToast({
                      title: '保存成功',
                      icon: 'none'
                    });
                  },
                  fail: function (res) {
                    uni.hideLoading()
                    uni.showToast({
                      title: '保存失败',
                      icon: 'none'
                    });
                  }
                })
              }
            },
            fail: (err) => {
              uni.hideLoading()
            }
          });
        });
      } else {
        uni.hideLoading()
        uni.showToast({
          title: '暂无数据',
          icon: 'none'
        });
      }
    },
    // 保存图片
    H5savePic(Url) {
      let that = this

      // #ifdef H5
      //console.log(that.dijige)
      that.defoImg = that.Shareposters[that.dijige]
      that.ServiceAnimate = true
      //setTimeout(() => {
      //	that.ServiceAnimate = false
      //}, 2500)
      //#endif

      // #ifdef APP-PLUS
      uni.showLoading({
        title: '保存中'
      });
      uni.downloadFile({
        url: that.defoImg,
        success: (res) => {
          if (res.statusCode === 200) {
            uni.hideLoading();
            uni.saveImageToPhotosAlbum({
              filePath: res.tempFilePath,
              success: function () {
                uni.showToast({
                  title: "保存成功",
                  icon: "none"
                });
              },
              fail: function () {
                uni.hideLoading();
                uni.showToast({
                  title: "保存失败，请稍后重试",
                  icon: "none"
                });
              }
            });
          }
        },
        fail: (err) => {
          uni.hideLoading();
          uni.showToast({
            title: "失败啦",
            icon: "none"
          });
        }
      })
      //#endif
    },
  //   复制文案
    copyText(val){
      let that = this
      if(val){
        uni.setClipboardData({
          data: val,
          showToast: false,
          success: function() {
            that.$nextTick(() => {
              that.SanMaCuoWuShow = true
            })
          },
          complete: () => {
            // #ifdef MP-WEIXIN
            wx.hideToast()
            // #endif
          }
        });
      }else{
        uni.showToast({
          title: '暂无文案，请联系管理员',
          icon: 'none'
        });
      }

      //this.FxHbshow = false
      //setTimeout(()=>{

      //},200)
    },
    shareminiwxapp() {
      let that = this
      wx.downloadFile({
        url: that.defoImg,
        success: (res) => {
          //console.log("res:", res)
          wx.showShareImageMenu({
            path: res.tempFilePath
          })
        },
        fail: (res) => {
          //console.log(res)
          if (res.errMsg.indexOf('deny') != -1 || res.errMsg.indexOf('denied') != -1) {
            wx.showToast({
              title: '保存相册失败，请设置权限！',
              icon: 'none',
              duration: 2000,
            })
          } else {
            wx.showToast({
              title: '保存相册失败，请重试！',
              icon: 'none',
              duration: 2000,
            });
          }
        }
      })
    },
  },
}
</script>

<template>
  <view>
    <scroll-view class="uni-swiper-tab" scroll-y style="height: calc(100vh - 420rpx)">
      <view style="height: 20rpx"></view>
      <!--    图片滚动区域-->
      <view class="uni-margin-wrap">
        <swiper class="swiper" circular next-margin="118rpx"  previous-margin="20rpx" @change="qiehuanle">
          <swiper-item v-for="(item,index) in Shareposters" :key="index">
            <view class="swiper-item">
              <image :src="item" mode="widthFix" style="border-radius: 30rpx"></image>
            </view>
          </swiper-item>
        </swiper>
      </view>
      <!--   文案复制 -->
      <view class="copywriting">
        <view class="copywriting-content">
          <view class="copywriting-content-title">
            <image :src="`https://td.lszbg.com/public/uploads/h5/home/copywriting_title.png`"></image>
            <text class="copywriting-content-title-text">复制文案搭配邀请码使用更有效哦~</text>
            <view class="copywriting-content-title-right" @click="copyText(copyWritingText)">
              <image :src="`https://td.lszbg.com/public/uploads/h5/home/copywriting_title_icon.png`"></image>
              <text>复制文案</text>
            </view>
          </view>
          <view class="copywriting-content-text">
            {{copyWritingText}}
<!--            <text>美食不仅仅是满足，更是一种生活的艺术。这道佳肴，色彩斑斓，味道层次分明，让人回味无穷。</text>
            <text style="color: #FF7A00">#领食惠探店，#领食周边购，#领食霸王餐</text>-->
          </view>
        </view>
      </view>
    </scroll-view>

<!--    分享按钮-->
    <view style="position: fixed;bottom: 0;right: 0;left: 0;background-color: white;border-radius: 30rpx 30rpx 0 0">
      <view class="u-flex" style="padding: 30rpx 0;margin-top: 30rpx;height: 100%;">
        <button style="text-align: center;flex: 1;background-color: white"
                open-type="share" :data-obj="urerinfo" catchtap="share">
          <image :src="icon[0].image" style="width: 80rpx;height: 80rpx"></image>
          <view style="font-size: 28rpx;font-weight: bold;margin-top: 16rpx">{{ icon[0].name }}</view>
          <view style="font-size: 24rpx;color: #999999;">{{ icon[0].sub_name }}</view>
        </button>
        <button style="text-align: center;flex: 1;background-color: white" @click="wxminisavePic()">
          <image :src="icon[1].image" style="width: 80rpx;height: 80rpx"></image>
          <view style="font-size: 28rpx;font-weight: bold;margin-top: 16rpx">{{ icon[1].name }}</view>
          <view style="font-size: 24rpx;color: #999999;">{{ icon[1].sub_name }}</view>
        </button>
        <button style="text-align: center;flex: 1;background-color: white"
                open-type="share" :data-obj="urerinfo" catchtap="share">
          <image :src="icon[2].image" style="width: 80rpx;height: 80rpx"></image>
          <view style="font-size: 28rpx;font-weight: bold;margin-top: 16rpx">{{ icon[2].name }}</view>
          <view style="font-size: 24rpx;color: #999999;">{{ icon[2].sub_name }}</view>
        </button>
      </view>
      <view style="height: 88rpx"></view>
    </view>
<!--    复制成功弹出层-->
    <u-popup v-model="SanMaCuoWuShow" mode="center" width="80%" border-radius="34" :closeable="true" @close="SanMaCuoWuShowclose">
      <view class="cuowuPopup_wrap">
        <image :src="BestImgUrlTD + '/image_998.png'"></image>
        <view class="title">复制成功</view>
        <view class="subtitle">快去分享到社群或者朋友圈吧</view>
        <view class="fenxiang-btn" style="margin-top: 50rpx;">
          <!-- #ifdef MP-WEIXIN -->
          <button class="btn-1 btn-w" open-type="share" :data-obj="urerinfo" catchtap="share">
            <view class="btn_d66">
              <image class="wxicon" :src="BestImgUrl + '/money/money_weixin_icon02.png'" @click="shareminiwxapp()">
              </image>
              <view>微信好友</view>
            </view>
          </button>
          <!-- #endif -->
        </view>
      </view>
    </u-popup>
  </view>
</template>
<style>
page {
  background-color: #F5F5F5;
  height: 100%;
}
</style>
<style scoped lang="scss">
/deep/ button {
  background-color: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  font-size: 28rpx !important;
  color: #333333 !important;
}

/deep/ button::after {
  border: none !important;
}

.swiper {
  height: 780rpx;
  margin-top: 20rpx;
}

.swiper-item {
  display: block;
  height: 780rpx;

  image {
    height: 780rpx;
    width: 590rpx;
  }
}

.swiper-list {
  margin-top: 40rpx;
  margin-bottom: 0;
}

.uni-common-mt {
  margin-top: 60rpx;
  position: relative;
}

.info {
  position: absolute;
  right: 20rpx;
}

.uni-padding-wrap {
  width: 550rpx;
  padding: 0 100rpx;
}
// 文案复制css
.copywriting {
  margin: 20rpx 30rpx;

  border-radius: 30rpx;
  overflow: hidden;
  .copywriting-content {
    background: linear-gradient( 171deg, #FFF6ED 0%, #FFFFFF 99%);
    padding-bottom: 20rpx;
    .copywriting-content-title {
      position: relative;
      padding: 30rpx;
      background: url("https://td.lszbg.com/public/uploads/h5/home/copywriting_bg.png") no-repeat;
      background-size: 100% 224rpx;
      .copywriting-content-title-text{
        display: block;
        color: #666666;
        font-size: 26rpx;
      }
      image {
        width: 320rpx;
        height: 48rpx;
      }
      .copywriting-content-title-right {
        position: absolute;
        right: 20rpx;
        top: 16rpx;
        background: #FFFFFF;
        border-radius: 30rpx;
        padding: 10rpx 20rpx;
        image {
          width: 32rpx;
          height: 32rpx;
          margin-right: 10rpx;
        }
      }
    }
    .copywriting-content-text{
      margin: 20rpx 30rpx;
      padding: 20rpx;
      border-radius: 16rpx;
      background: #FFF9EB;
      text {
        font-size: 28rpx;
        color: #3D3D3D;
        line-height: 40rpx;
      }
    }
  }

}
//复制文案css
.cuowuPopup_wrap {
  text-align: center;
  background-image: linear-gradient(to top, #ffffff, #FFEDE7);
  padding: 60rpx 60rpx 60rpx 60rpx;
  image {
    width: 252rpx;
    height: 252rpx;
    margin-bottom: 50rpx;
  }
  .title {
    font-weight: bold;
    font-size: 36rpx;
    margin-bottom: 12rpx;
  }
  .subtitle {
    font-size: 28rpx;
  }
  .resbtn {
    background-color: #FF4E0D;
    border-radius: 200rpx;
    color: #ffffff;
    width: 252rpx;
    height: 80rpx;
    line-height: 80rpx;
    text-align: center;
    margin: 48rpx auto 0;
  }
  .wxicon{
    width: 128rpx;
    height: 128rpx;
    margin-bottom: 0;
  }
}
</style>